<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Liubuzhu
  Date: 2023/12/11
  Time: ฅ(΅•ㅅ•΅❀)ฅ 16:10
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
	<title>首页</title>
	<style>
		.bd-placeholder-img {
			font-size: 1.125rem;
			text-anchor: middle;
			-webkit-user-select: none;
			-moz-user-select: none;
			user-select: none;
		}

		@media (min-width: 768px) {
			.bd-placeholder-img-lg {
				font-size: 3.5rem;
			}
		}

		.b-example-divider {
			height: 3rem;
			background-color: rgba(0, 0, 0, .1);
			border: solid rgba(0, 0, 0, .15);
			border-width: 1px 0;
			box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
		}

		.b-example-vr {
			flex-shrink: 0;
			width: 1.5rem;
			height: 100vh;
		}

		.bi {
			vertical-align: -.125em;
			fill: currentColor;
		}

		.nav-scroller {
			position: relative;
			z-index: 2;
			height: 2.75rem;
			overflow-y: hidden;
		}

		.nav-scroller .nav {
			display: flex;
			flex-wrap: nowrap;
			padding-bottom: 1rem;
			margin-top: -1px;
			overflow-x: auto;
			text-align: center;
			white-space: nowrap;
			-webkit-overflow-scrolling: touch;
		}

		.gradient-text {
			background: linear-gradient(to right, #ff0000, #00ff00, #0000ff);
			-webkit-background-clip: text;
			color: transparent;
		}
	</style>
	<link rel="stylesheet" href="<c:url value="/css/bootstrap.min.css"/>">
	<link href="<c:url value="/css/carousel.css"/>" rel="stylesheet">
	<script src="<c:url value="/js/bootstrap.bundle.min.js"/>"></script>
	<script src="<c:url value="/js/bootstrap.min.js"/>"></script>
</head>
<body>

<main>
	<jsp:include page="/view/common/header.jsp"></jsp:include>

	<div id="myCarousel" class="carousel slide" data-bs-ride="carousel">
		<div class="carousel-indicators">
			<button type="button" data-bs-target="#myCarousel" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
			<button type="button" data-bs-target="#myCarousel" data-bs-slide-to="1" aria-label="Slide 2"></button>
			<button type="button" data-bs-target="#myCarousel" data-bs-slide-to="2" aria-label="Slide 3"></button>
		</div>
		<div class="carousel-inner">
			<div class="carousel-item active">
				<img src="<c:url value="/img/home/benghuai.jpg"/>" >
				<div class="container">
					<div class="carousel-caption text-start">
						<h1>崩坏</h1>
						<p>好玩好玩好玩好玩好玩</p>
						<p><a class="btn btn-lg btn-primary" href="#">了解更多</a></p>
					</div>
				</div>
			</div>
			<div class="carousel-item">
				<img src="<c:url value="/img/home/yuanshen.jpg"/>">
				<div class="container">
					<div class="carousel-caption">
						<h1>原神</h1>
						<p>好玩好玩好玩好玩好玩</p>
						<p><a class="btn btn-lg btn-primary" href="#">了解更多</a></p>
					</div>
				</div>
			</div>
			<div class="carousel-item">
				<img src="<c:url value="/img/home/huanta.jpg"/>" >
				<div class="container">
					<div class="carousel-caption text-end">
						<h1>幻塔</h1>
						<p>好玩好玩好玩好玩好玩</p>
						<p><a class="btn btn-lg btn-primary" href="#">了解更多</a></p>
					</div>
				</div>
			</div>
		</div>
		<button class="carousel-control-prev" type="button" data-bs-target="#myCarousel" data-bs-slide="prev">
			<span class="carousel-control-prev-icon" aria-hidden="true"></span>
			<span class="visually-hidden">Previous</span>
		</button>
		<button class="carousel-control-next" type="button" data-bs-target="#myCarousel" data-bs-slide="next">
			<span class="carousel-control-next-icon" aria-hidden="true"></span>
			<span class="visually-hidden">Next</span>
		</button>
	</div>


	<div class="container marketing" >

		<hr class="featurette-divider">

		<div class="row featurette" style="margin-left: 50px">
			<div class="col-md-7">
				<h2 class="featurette-heading fw-normal lh-1">一起玩PC好游戏</h2>
				<p class="lead">高品质游戏齐聚FunPlay</p>
			</div>
			<div class="col-md-5">
				<img src="<c:url value="/img/home/w1.png"/>" >
			</div>
		</div>

		<hr class="featurette-divider">

		<div class="row featurette" style="margin-left: 50px">
			<div class="col-md-7 order-md-2">
				<h2 class="featurette-heading fw-normal lh-1">一起发现大家最爱的那款</h2>
				<p class="lead">全新界面，呈现热门游戏</p>
			</div>
			<div class="col-md-5 order-md-1">
				<img src="<c:url value="/img/home/w2.png"/>" >
			</div>
		</div>

		<hr class="featurette-divider">

		<div class="row featurette" style="margin-left: 50px">
			<div class="col-md-7">
				<h2 class="featurette-heading fw-normal lh-1">一起迎接每一次挑战</h2>
				<p class="lead">游戏内外，助手功能全面助力</p>
			</div>
			<div class="col-md-5">
				<img src="<c:url value="/img/home/w3.png"/>" >
			</div>
		</div>
	</div>

	<jsp:include page="/view/common/footer.jsp"></jsp:include>

</body>
</html>